<template>
  <div>
    <el-dialog title="设备详情" :visible="detaill" :before-close="close"> 
     <div class="box1">
      <span>销售量:4638 个</span>
      <span>销售额:1.13 万元</span>
      <span>补货次数:0 次</span>
      <span>维修次数:0 次</span>
     </div>
     <p>商品销量（月）</p>
     <div class="box2">
           <div v-for="(item,index) in row" :key="index">{{item.skuName}}:{{item.count}}</div>
     </div>

   </el-dialog>
  </div>
</template>
   
<script>
  //  import {shjspxlApi} from '@/api/DeviceStatus'
export default {
  name: 'HrsaasDetail',
  props:{
    detaill:{
      type:Boolean,
      default:true
    },
    row:{
    //  type:Object,
      default:()=>[]
    }
  },
  data() {
    return {
    };
  },

  mounted() {
      // this.shjspxlAp()
  },
  // created(){
  //   this.shjspxlAp()
  // },


  methods: {
    close(){
      this.$emit('update:detaill',false)
    },
  

    // 搜索售货机(售货机列表)    渲染查看详情
  //  async shjspxlAp(){
  //       console.log(this.row,'111111');
  //       const res =  await shjspxlApi({innerCode:`${this.row.clientId}`,start:'2020-01-01',end:'2023-03-03'})
  //      console.log(res,'渲染查看详情');   
     
  //  }
    },
};
</script>

<style lang="scss" scoped>
     .box1{
      background-color:#f4f6fb;
      height: 40px;
      display: flex;
      justify-content: space-evenly;
      align-items: center;
         span{
                font-size: 16px;

         }
     }

     .box2{
      display: flex;
      flex-wrap: wrap;
      box-sizing: border-box;
         div{
          width: 25%;
          height: 100px;
          border: 1px solid #d8dde3;
          padding: 40px 20px;
         }
     }


</style>